<template>
  <div class="home">
    <canvas id="canvas" />
  </div>
</template>

<script>
import { init } from "@/assets/js/clock.js";

export default {
  name: "Home",
  data() {
    return {
      ctx: {},
      obj: {
        width: 300,
        height: 300,
      },
    };
  },
  mounted() {
    this.initCanvas();
  },
  methods: {
    initCanvas() {
      const canvas = document.querySelector("#canvas");
      this.ctx = canvas.getContext("2d");
      canvas.width = this.obj.width;
      canvas.height = this.obj.height;
      init(this.ctx, this.obj);
    },
  },
};
</script>

<style scoped></style>
